<template>
  <el-select v-model="selectvalue" :clearable="true" :disabled="disabled || disableds" :multiple="multiples"
    :placeholder="placeholder||''" @change="changeParent">
    <el-option v-for="item in options" :key="item.code" :label="item.name" :value="item.code" />
  </el-select>
</template>

<script>
  import {
   getListDefaults
  } from '@/api/adminPage/attributeDefinition/materials'
  export default {
    props: {
      dictType: {
        type: String
      },
      value: {
        type: String
      },
      multiple: String,
      placeholder: {
        type: String
      },
      outfilter: Array,
      disabled: {
        type: Boolean,
        default: false,
        required: false
      }
    },
    data() {
      return {
        options: [],
        oldOptions: [],
        selectvalue: [],
        multiples: false,
        disableds: false,
        optionMap: new Map()
      }
    },
    watch: {
      value: function(newVal) {
        if (this.multiple) {
          if (newVal) {
            this.selectvalue = newVal.split(',')
          }
        } else {
          this.selectvalue = newVal
        }
      },
      selectvalue: function(newVal, oldVal) {
        if (oldVal) {
          if (!Array.isArray(oldVal)) {
            oldVal = oldVal.split(',')
          }
        }
        if (newVal) {
          if (!Array.isArray(newVal)) {
            newVal = newVal.split(',')
          }
          if (newVal !== oldVal) {
            this.$emit('input', newVal.join(','))
          }
        } else {
          this.$emit('input', '')
        }
      },
      disabled(newValue) {
        if (this.disabled) {
          this.disableds = this.stringToBoolean(this.disabled)
        } else {
          this.disableds = false
        }
      },
      outfilter() {
        this.filerArray()
      }

    },
    created() {
      // 获取字典值
      const query = {
        code: this.dictType
      }
      const that = this
      getListDefaults(query).then(response => {
        that.oldOptions = response.result
        // 初始化map对象
        that.oldOptions.forEach(row => {
          const obj = {}
          obj.lable = row.name
          obj.value = row.code
          this.optionMap.set(row.dictValue, obj)
        })
        this.filerArray()
      })
      if (this.multiple) {
        this.multiples = this.stringToBoolean(this.multiple)
        if (this.value) {
          this.selectvalue = this.value.split(',')
        }
      } else {
        this.selectvalue = this.value
      }
      if (this.disabled) {
        this.disableds = this.stringToBoolean(this.disabled)
      } else {
        this.disableds = false
      }
    },
    methods: {
      changeParent() {
        const changevalue = this.selectvalue
        const array = []
        if (Array.isArray(changevalue)) {
          changevalue.forEach(row => {
            if (this.optionMap.get(row)) {
              array.push(this.optionMap.get(row))
            }
          })

          this.$emit('selected', array)
        } else {
          if (this.optionMap.get(changevalue)) {
            array.push(this.optionMap.get(changevalue))
          }
          this.$emit('selected', array)
        }
        this.$emit('change', changevalue)
      },
      stringToBoolean(str) {
        if (typeof str === 'boolean') return str
        switch (str.toLowerCase()) {
          case 'true':
          case 'yes':
          case '1':
            return true
          case 'false':
          case 'no':
          case '0':
          case null:
            return false
          default:
            return Boolean(str)
        }
      },
      setValues(value) {
        this.value = value
      },
      filerArray() {
        if (this.outfilter) {
          const array = []
          const optionfilterMap = new Map()
          this.outfilter.forEach(row => {
            optionfilterMap.set(row, row)
          })
          this.oldOptions.forEach(row => {
            if (!(optionfilterMap && optionfilterMap.get(row.dictValue))) {
              array.push(row)
            }
          })
          this.options = array
        } else {
          this.options = this.oldOptions
        }
      }
    }
  }
</script>

<style>
</style>
